{% extends '@SonataAdmin/CRUD/edit.html.twig' %}

{% block stylesheets %}
    {{ parent() }}

    <link rel="stylesheet" href="{{ asset('css/backend/page/edit.css') }}"/>
    <link rel="stylesheet" href="{{ asset('other/datepicker/datepicker3.css') }}"/>
    <link rel="stylesheet" href="{{ asset('other/timepicker/bootstrap-timepicker.css') }}"/>
    <link rel="stylesheet" href="{{ asset('other/dropzone/min/dropzone.min.css') }}"/>
{% endblock %}

{% block javascripts %}
    {{ parent() }}

    <script src="{{ asset('other/tinymce/tinymce.min.js') }}" type="text/javascript"></script>
    <script src="{{ asset('other/datepicker/bootstrap-datepicker.js') }}" type="text/javascript"></script>
    <script src="{{ asset('other/datepicker/locales/bootstrap-datepicker.zh-CN.js') }}" type="text/javascript"></script>
    <script src="{{ asset('other/timepicker/bootstrap-timepicker.js') }}" type="text/javascript"></script>
    <script src="{{ asset('other/dropzone/min/dropzone.min.js') }}" type="text/javascript"></script>
{% endblock %}

{% block form %}
    {{ parent() }}

    <script>
        $(function () {
            tinymce.init({
                selector: '#{{ admin.uniqid }}_content',
                language: 'zh_CN',
                height: 1000,
                branding: false,
                plugins: 'advlist autolink link image lists preview code table fullscreen wordcount',
                toolbar: 'preview | undo redo | styleselect | bold italic alignleft aligncenter alignright alignjustify bullist numlist | blockquote link image table code fullscreen',
                images_upload_handler: function (blobInfo, success, failure, progress) {
                    let xhr, formData;
                    xhr = new XMLHttpRequest();
                    xhr.withCredentials = false;
                    xhr.open("POST", "{{ path('admin_default_image_upload', {path: 'page_content_image'}) }}");
                    xhr.upload.onprogress = function (e) {
                        progress(e.loaded / e.total * 100);
                    };
                    xhr.onload = function() {
                        let json;
                        if (xhr.status < 200 || xhr.status >= 300) {
                            failure('HTTP Error: ' + xhr.status);
                            return;
                        }
                        json = JSON.parse(xhr.responseText);
                        if (!json.result.success) {
                            failure('错误: ' + json.result.error_msg);
                            return;
                        }
                        success(json.content.url);
                    };

                    xhr.onerror = function () {
                        failure('Image upload failed due to a XHR Transport error. Code: ' + xhr.status);
                    };

                    formData = new FormData();
                    formData.append('file_data', blobInfo.blob(), blobInfo.filename());
                    xhr.send(formData);
                }
            });
        });
    </script>
{% endblock %}